<template>
  <div>
    <van-popup lazy-render :lock-scroll="false" v-model:show="showLoginCenter" round :style="{ padding: '0' }">
      <template #default>
        <div>
          <!--          已经登录-->
          <AlreadyLoginContent
            v-if="isLogin"
            :showLoginCenter="showLoginCenter"
            @changeShowCenterStatus="changeShowStatus" />
          <!--          未登录-->
          <LoginRightContent v-else />
        </div>
      </template>
    </van-popup>
  </div>
</template>

<script setup lang="ts">
import { useHomeStore } from '~/store/home'
import AlreadyLoginContent from '~/components/login/AlreadyLoginContent.vue'
import { useMemberStore } from '~/store/member'

const memberStore = useMemberStore()
const { memberInfo, isLogin } = storeToRefs(memberStore)
const props = defineProps(['modelValue'])
const emit = defineEmits(['update:modelValue'])
const router = useRouter()
const homeStore = useHomeStore()
const showLoginCenter = computed({
  get() {
    return props.modelValue
  },
  set(val) {
    emit('update:modelValue', val)
  },
})
const changeShowStatus = (val: boolean) => {
  showLoginCenter.value = val
}
</script>

<style scoped lang="scss">
:deep(.van-popup) {
  background-color: #31383b;
}
</style>
